<template>
  <van-popup :value="showPopup" round position="bottom" :style="{ height: '450px' }" closeable @click-overlay="close"
    @click-close-icon="close" close-icon-position="top-left">
    <div class="button">
      <span @click="submit">确定</span>
    </div>
    <div class="cell_group">
      <van-cell-group>
        <van-cell v-for="(item,i) in data" :key="i" :title="item.title" @click="item.select = !item.select">
          <template #right-icon>
            <van-checkbox v-model="item.select" checked-color="#13b5b1"></van-checkbox>
          </template>
        </van-cell>
      </van-cell-group>
    </div>
  </van-popup>
</template>

<script>
  export default {
    computed: {
      showPopup() {
        return this.show
      }
    },
    props: {
      show: {
        default: false,
        type: Boolean
      },
      data: {
        default: () => ([]),
        type: Array
      }
    },
    data() {
      return {
        choseList: [],
      }
    },
    methods: {
      close() {
        this.$emit('update:show', false)
      },
      submit(){
        this.$emit('update:show', false)
      }
    }

  }
</script>

<style lang='less' scoped>
.button{
  height: 100px;
  // display: flex;
  // align-items: center;
  // justify-content: end;
  padding-right: 32px;
  color: #13b5b1;
  text-align: right;
  line-height: 100px;
}
</style>